<template>
	<view class="page">
    <u-navbar :fixed="false" title="入库单列表" :autoBack="true" bgColor="transparent"></u-navbar>
    <view class="content">
      <view class="search">
        <view class="search-type" @click="pickerType = 'type'">{{ form.typeName }}
          <u-icon name="arrow-down" size="24rpx"></u-icon>
        </view>
        <u-search
          placeholder="请输入"
          v-model="searchValue"
          @search="search"
          :showAction="false"
        ></u-search>
      </view>
      <!-- <view class="condition-center">
        <view class="condition-item" @click="showDatetime = true">
          <text class="u-line-1">{{ form.FDate || '业务日期'}}</text><u-icon color="#000" size="24rpx" name="arrow-down"></u-icon>
        </view>
      </view> -->
      <view class="list">
        <u-list>
          <u-list-item>
            <view class="list-item" v-for="(item, index) in list" :key="index" @click="toPage(item)">
              <view class="u-flex u-m-b-18">
                <view class="u-flex-1 h5 u-m-b-0">{{ item[0] }}</view>
                <view style="color: #FF8819;">{{ statusInfo[item[1]] }}</view>
              </view>
              <view class="u-flex form-info">
                <view class="u-flex-1 form-content">
                  <view>{{ item[9] }}</view>
                  <view class="u-info u-font-24">{{ item[10] }}</view>
                </view>
                <view class="price">数量:{{ item[14] }}</view>
              </view>
              <view class="u-flex">
                <view class="u-flex-1 form-info">
                </view>
                <view class="form-info">
                  <view class="form-content">{{ item[2].substring(0, 10) }}</view>
                </view>
              </view>
            </view>
          </u-list-item>
        </u-list>
        <!-- <u-empty></u-empty> -->
      </view>
    </view>
    <u-picker
      :show="pickerType!=''"
      :columns="[pickerInfo[pickerType]]"
      keyName="name"
      @confirm="pickerConfirm"
      @cancel="pickerType = ''"
    ></u-picker>
    <u-datetime-picker v-model="datetime" mode="date" :show="showDatetime" @confirm="datetimeConfirm" cancelText="清除" @cancel="datetimeCancel"></u-datetime-picker>
	</view>
</template>

<script>
import { getMaterialInformation, dynamicFormServicePush } from '../../api/index'
import { formatTimeTwo } from '../../common/util'

export default {
  data() {
    return {
      datetime: new Date().getTime(),
      isFullSucreen: this.isFullSucreen,
      searchValue: '',
      pickerType: '',
      pickerInfo: {
         type: [
          {
            id: 'FMaterialId.FNumber',
            name: '物料编码'
          },
          {
            id: 'FMaterialName',
            name: '物料名称'
          },
          {
            id: 'FSupplierId.fname',
            name: '供应商',
          },
          {
            id: 'FUOM',
            name: '规格型号'
          },
          {
            id: 'fbillno',
            name: '单据编号'
          },
        ],
      },
      showDatetime: false,
      form: {
        typeName: '物料编码',
        type: 'FMaterialId.FNumber',
      },
      isMore: true,
      StartRow: 0,
      Limit: 200,
      list: [],
			userInfo: {},
			orgInfo: {},
      statusInfo: {
        'A': '创建',
        'B': '审核中（提交）',
        'C': '已审核',
        'D': '重新审核',
        'Z': '暂存',
      },
    }
  },
  onLoad() {
		this.userInfo = uni.getStorageSync('userInfo')
    this.orgInfo = uni.getStorageSync('orgInfo')
  },
	onShow() {
		this.list = []
		this.getPage()
	},
  methods: {
    toPage(item) {
      const options = {
        id: item[23],
        status: item[1],
      }
      this.jumpTo('/other/purchase/warehousingDetail', options)
    },
    getPage(f = false) {
      const parameters = [
        {
          "FormId": "STK_InStock",
          "FieldKeys": `fbillno,FDocumentStatus,FDate,FSupplierId.fname,F_PCYE_Text_pzg,F_PCYE_Text_qtr,F_PCYE_Text_83g,FStockOrgId.fname,
            FMaterialId.FNumber,FMaterialName,FUOM,FStockId.FNumber,FStockId.fname,FMustQty,FRealQty,FTaxPrice,FEntryTaxRate,FEntryTaxAmount,FAllAmount,
            FUnitID.fname,F_PCYE_BaseProperty_cgy,F_PCYE_Qty_qtr,F_PCYE_Qty_qtr1,fid`,
					"FilterString": "FPurchaseOrgId.fname = '"+ this.orgInfo.orgName +"'",
          "OrderString": "fdate desc",
          "TopRowCount": 0,
          "StartRow": this.Limit * this.StartRow,
          "Limit": this.Limit,
          "SubSystemId": ""
        }
      ]
      if(this.form.FDate) {
        parameters[0].FilterString = parameters[0].FilterString + "and FDate = '"+ this.form.FDate +"'"
      }
      if(this.searchValue) {
        parameters[0].FilterString = parameters[0].FilterString +  "and " + this.form.type + " like '%"+ this.searchValue +"%'"
      }
      uni.showLoading({ mask:true })
      getMaterialInformation({parameters}).then(res => {
        uni.hideLoading()
        if(res.length < this.Limit) {
          this.isMore = false
        }
        if(f) {
          this.list = []
        }
        this.list = [...this.list, ...res]
      })
    },
    search() {
      this.StartRow = 0
      this.getPage(true)
    },
    pickerConfirm(e) {
      if(e.value[0].id) {
        this.form[this.pickerType] = e.value[0].id
        this.form[this.pickerType+'Name'] = e.value[0].name
      } else {
        this.form[this.pickerType] = ''
        this.form[this.pickerType+'Name'] = ''
      }
      this.pickerType = ''
    },
    datetimeConfirm(e) {
      this.form.FDate = formatTimeTwo(e.value, 'Y-M-D')
      this.showDatetime = false
      this.getPage(true)
    },
    datetimeCancel() {
      this.form.FDate = ''
      this.datetime = new Date().getTime()
      this.showDatetime = false
      this.getPage(true)
    },
  },
  onReachBottom() {
    if(this.isMore) {
      this.StartRow++
      this.getPage()
    }
  }
}
</script>

<style lang="scss" scoped>
.page{
	width: 750rpx;
	min-height: 100vh;
  padding-bottom: 348rpx;
  .content {
    width: 100%;
    padding: 0 30rpx;
  }
  .search {
    margin-top: 20rpx;
    margin-bottom: 40rpx;
    padding: 16rpx 20rpx;
    background: #FFF;
    border-radius: 20rpx;
    box-shadow: 3rpx 3rpx 4rpx rgba(0, 0, 0, 0.16);
    display: flex;
    align-items: center;
    .search-type {
      width: 180rpx;
      margin-right: 10rpx;
      font-size: 28rpx;
      display: flex;
      align-items: center;
      gap: 6rpx;
    }
  }
  .condition-center {
    width: 690rpx;
    padding: 16rpx 20rpx;
    background: #FFF;
    border-radius: 20rpx;
    box-shadow: 3rpx 3rpx 4rpx rgba(0, 0, 0, 0.16);
    margin: 0 auto 40rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    .condition-item {
      flex: 1;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 12rpx;
      color: #000;
      font-size: 28rpx;
    }
  }
  .list {
    margin-bottom: 20rpx;
    background: #FFF;
    border-radius: 20rpx;
    box-shadow: 3rpx 3rpx 4rpx rgba(0, 0, 0, 0.16);
    .list-item {
      padding: 20rpx 30rpx;
      border-bottom: 2rpx solid rgb(214, 215, 217);
      .price {
        color: red;
        font-size: 28rpx;
        font-weight: 500;
        text {
          font-size: 36rpx;
        }
      }
    }
  }
  .footer {
    width: 100%;
    // background: #2979ff;
    position: fixed;
    left: 0;
    bottom: 0;
    .total-info {
      background: #fdf6ec;
      padding: 20rpx 30rpx;
      color: #000;
      font-family: "PingFang SC";
      font-size: 36rpx;
    }
    .btn {
      width: 100%;
      // height: 90rpx;
      line-height: 90rpx;
      text-align: center;
      background: #2979ff;
      color: #FFF;
      font-family: "PingFang SC";
      font-size: 36rpx;
    }
  }
}
</style>
